<!-- 核心就是 a标签 包 span标签
<!DOCTYPE html> -->
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>滑动门技术</title>
	<style>
		a {
			display: inline-block;
			/* 滑动门左右滑动， 给个固定的高 */
			height: 33px;
			background: url(images/to.png) no-repeat;
			margin-top: 100px;
			padding-left: 15px;

		}

		a span {
			display: inline-block;
			height: 33px;
			background: url(images/ao.png) right top; /* 背景图片右对齐 */
			padding-right: 15px;
		}


	</style>
	
</head>
<body>
	<!-- 类似滑动门， a设置左侧背景， span设置右边侧背景 ，因为整个导航栏都是链接所以a包含 -->
	<a href="#">
		<span>
		<!-- 文字越多往两边撑开， 就像推拉门 -->
			首頁12312312312312
		</span>
	</a>
</body>
</html>